<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	    		xmlns:ui="http://java.sun.com/jsf/facelets"
	  			xmlns:h="http://java.sun.com/jsf/html"
	  			xmlns:f="http://java.sun.com/jsf/core">

<f:view contentType="text/html">

<h2>Book Hotel</h2>
<h:form id="booking">
	<h:messages errorClass="errors" />
	<fieldset>
		<table>
			<tr class="field">
				<td class="label">Name:</td>
				<td class="output">#{booking.hotel.name}</td>
			</tr>
			<tr class="field">
				<td class="label">Address:</td>
				<td class="output">#{booking.hotel.address}</td>
			</tr>
			<tr class="field">
				<td class="label">City, State:</td>
				<td class="output">#{booking.hotel.city}, #{booking.hotel.state}</td>
			</tr>
			<tr class="field">
				<td class="label">Zip:</td>
				<td class="output">#{booking.hotel.zip}</td>
			</tr>
			<tr class="field">
				<td class="label">Country:</td>
				<td class="output">#{booking.hotel.country}</td>
			</tr>
	        <tr class="field">
	            <td class="label">Nightly rate:</td>
	            <td class="output">
	                <h:outputText value="#{booking.hotel.price}">
	                    <f:convertNumber type="currency" currencySymbol="$"/>
	                </h:outputText>
	            </td>
	        </tr>
			<tr class="field">
				<td class="label">
					<h:outputLabel for="checkinDate">Check In Date:</h:outputLabel>
				</td>
				<td class="input">
		        	<h:inputText id="checkinDate" value="#{booking.checkinDate}" required="true">
	                	<f:convertDateTime pattern="yyyy-MM-dd" timeZone="EST"/>
	                </h:inputText>
				</td>
			</tr>
			<tr class="field">
				<td class="label">
					<h:outputLabel for="checkoutDate">Check Out Date:</h:outputLabel>
				</td>
				<td class="input">
					<h:inputText id="checkoutDate" value="#{booking.checkoutDate}" required="true">
						<f:convertDateTime pattern="yyyy-MM-dd" timeZone="EST"/>
					</h:inputText>
				</td>
			</tr>
			<tr class="field">
				<td class="label">
					<h:outputLabel for="beds">Room Preference:</h:outputLabel>
				</td>
				<td class="input">
					<h:selectOneMenu id="beds" value="#{booking.beds}">
						<f:selectItems value="#{referenceData.bedOptions}"/>
					</h:selectOneMenu>
				</td>
			</tr>
			<tr class="field">
				<td class="label">
					<h:outputLabel for="smoking">Smoking Preference:</h:outputLabel>
				</td>
				<td id="radio" class="input">
					<h:selectOneRadio id="smoking" value="#{booking.smoking}" layout="pageDirection">
						<f:selectItems value="#{referenceData.smokingOptions}"/>
					</h:selectOneRadio>
				</td>
			</tr>
			<tr class="field">
				<td class="label">
					<h:outputLabel for="creditCard">Credit Card #:</h:outputLabel>
				</td>
				<td class="input">
					<h:inputText id="creditCard" value="#{booking.creditCard}" required="true"/>
				</td>
			</tr>
			<tr class="field">
				<td class="label">
					<h:outputLabel for="creditCardName">Credit Card Name:</h:outputLabel>
				</td>
				<td class="input">
					<h:inputText id="creditCardName" value="#{booking.creditCardName}" required="true"/>
				</td>
			</tr>
			<tr class="field">
				<td class="label">
					<h:outputLabel for="creditCardExpiryMonth">Expiration Date:</h:outputLabel>
				</td>
				<td class="input">
					<h:selectOneMenu id="creditCardExpiryMonth" value="#{booking.creditCardExpiryMonth}">
						<f:selectItems value="#{referenceData.creditCardExpMonths}" />
					</h:selectOneMenu>
					<h:selectOneMenu id="creditCardExpiryYear" value="#{booking.creditCardExpiryYear}">
						<f:selectItems value="#{referenceData.creditCardExpYears}"/>
					</h:selectOneMenu>
				</td>
			</tr>
			<tr>
				<td colspan="2" class="buttonGroup">
					<h:commandButton id="proceed" action="proceed" value="Proceed"/>&#160;
					<h:commandButton id="cancel" immediate="true" value="Cancel" action="cancel"/>
				</td>
			</tr>
		</table>
	</fieldset>
</h:form>

</f:view>
</ui:composition>